<template>
  <div id="main2"></div>
</template>

<script lang="ts" setup>
import { onMounted } from "vue";
import * as echarts from "echarts";
import { Post_car } from "@/api/eracher";
var option;

onMounted(() => {
  var chartDom = document.getElementById("main2");
  var myChart = echarts.init(chartDom);
  Post_car().then((res) => {
    option = {
      tooltip: {
        trigger: "item",
      },
      series: [
        {
          roseType: "radius",
          name: "Access From",
          type: "pie",
          radius: ["20%", "70%"],
          // adjust the start and end angle
          startAngle: 180,
          endAngle: 360,
          data: [
            { value: 600, name: "600辆" },
            { value: 700, name: "700辆" },
            { value: 1000, name: "1000辆" },
            { value: 1100, name: "1100辆" },
            { value: 1200, name: "1200辆" },
          ],
        },
      ],
    };
    option.series.data = res.data.data;
    option && myChart.setOption(option);
  });
  option && myChart.setOption(option);
});
</script>

<style>
#main2 {
  width: 100%;
  height: 100%;
}
</style>
